<!DOCTYPE html>
<html lang="en">
  <head>
    <title>crayon - zoom example</title>
    <meta charset="utf-8">
  </head>
  <body>
    <canvas id="my-canvas" width="400" height="100"></canvas>

    <script src="../crayon.min.js"></script>
    <script>

      var canvas = new crayon.Canvas({ id: "my-canvas" });

      var text = new crayon.Text({
        label: "WHZOOOM!",
        bold: true,
        x: 200,
        y: 50,
        size: 60,
        scaleX: 0,
        scaleY: 0,
        color: '#f80',
        stroke: 1,
        strokeColor: '#000'
      });

      canvas.add(text);
      text.transform({
        transition: 'easeOut',
        duration: 1500,
        to: {
          scaleX: 1,
          scaleY: 1
        }
      });

    </script>
  </body>
</html>